<template>
  <div class="page flex-col">
    <div class="group_1 flex-col">
      <div class="block_1 flex-col">
        <div class="group_2 flex-row">
          <img
            class="label_1"
            referrerpolicy="no-referrer"
            src="./assets/img/MasterDDSSlicePNG6ff5037b934608ddea08824d9a0e5398.png"
          />
          <span class="text_1">搜索</span>
          <span class="text_2">21℃</span>
          <span class="text_3">尚芬芬</span>
          <img
            class="thumbnail_1"
            referrerpolicy="no-referrer"
            src="./assets/img/MasterDDSSlicePNG4e6c60cf2dd3a5e9f47c740103e8fb3d.png"
          />
        </div>
        <div class="group_3 flex-row">
          <img
            class="image_1"
            referrerpolicy="no-referrer"
            src="./assets/img/MasterDDSSlicePNG012da36756ca8a49467a432b6d612131.png"
          />
          <div class="text-wrapper_1 flex-col justify-between">
            <span class="text_4">XXXXXX资源信息平台</span>
            <span class="text_5">XXXX&nbsp;Change&nbsp;Cloud&nbsp;Speed&nbsp;To&nbsp;Cloud&nbsp;&nbsp;Platform</span>
          </div>
          <span class="text_6">首页</span>
          <span class="text_7">平台介绍</span>
          <span class="text_8">工作动态</span>
          <span class="text_9">应用中心</span>
          <span class="text_10">决策中心</span>
        </div>
        <div class="group_4 flex-row justify-between">
          <div class="block_2 flex-col">
            <div class="box_1 flex-row">
              <div class="image-text_1 flex-row justify-between">
                <span class="text-group_1">更多</span>
                <img
                  class="thumbnail_2"
                  referrerpolicy="no-referrer"
                  src="./assets/img/MasterDDSSlicePNG70eebb778c8306ad3d5f05118aa8f6ed.png"
                />
              </div>
              <div class="box_2 flex-row">
                <img
                  class="label_2"
                  referrerpolicy="no-referrer"
                  src="./assets/img/MasterDDSSlicePNG96ba6b03a975b55975637fad4c964f52.png"
                />
                <span class="text_11">常用数据应用</span>
                <div class="section_1 flex-col"></div>
              </div>
            </div>
          </div>
          <span class="paragraph_1">
            强国复兴有我
            <br />
            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;安国兴邦常在
          </span>
        </div>
      </div>
      <div class="block_3 flex-col">
        <div class="text-wrapper_2 flex-row"><span class="text_12">XXXX应用中心</span></div>
        <div class="section_2 flex-row justify-between">
          <div class="text-group_2 flex-col justify-between">
            <span class="text_13">30+个</span>
            <span class="text_14">数据应用</span>
          </div>
          <div class="text-wrapper_3 flex-col justify-between">
            <span class="text_15">100+个</span>
            <span class="text_16">用户</span>
          </div>
        </div>
        <div class="section_3 flex-row">
          <div class="text-group_3 flex-col justify-between">
            <span class="text_17">5万+次</span>
            <span class="text_18">日访问</span>
          </div>
        </div>
      </div>
      <div class="block_4 flex-col">
        <span class="text_19">XXXX可视化分析平台</span>
        <div class="group_5 flex-row justify-between">
          <div class="text-group_4 flex-col justify-between">
            <span class="text_20">10个</span>
            <span class="text_21">应用场景</span>
          </div>
          <div class="text-group_5 flex-col justify-between">
            <span class="text_22">20个</span>
            <span class="text_23">分析模型</span>
          </div>
        </div>
        <div class="group_6 flex-row">
          <div class="text-group_6 flex-col justify-between">
            <span class="text_24">200张</span>
            <span class="text_25">统计报表</span>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>
<script>
import * as echarts from 'echarts';
export default {
  data() {
    return {
      chart: null,
      constants: {}
    };
  },
  mounted() {
    this.initChart();
  },
  methods: {
    initChart() {
      this.chart = echarts.init(this.$refs.chartContainer);
      this.chart.setOption({
            xAxis: {
                type: 'category',
                data: ['2021-12', '2022-01', '2022-02', '2022-03', '2022-04', '2022-05', '2022-06']
            },
            yAxis: {
                type: 'value'
            },
            series: [
              {
                data: [820, 932, 901, 934, 1290, 1330, 1320],
                type: 'line',
                smooth: true
              }
            ]
      });
    }
  }
};
</script>
<style scoped lang="css" src="./assets/index.response.css" />
